<template>
	<div id="form2">
		<el-form :model="assetForm" status-icon :rules="rules" ref="form" label-width="100px" class="demo-assetForm">
		 <el-form-item label="名称" prop="assetFormName" ref='field'>
		 		<el-input placeholder="请输入内容" v-model="assetForm.assetFormName" id="assetFormName" auto-complete="off"></el-input>
		 </el-form-item> 
		</el-form>
	</div>
</template>

<script>
	export default {
	    data() {
	      return {
	        assetForm: {
	          assetFormName: '',
	          },
	        rules: {
	          assetFormName: [
	            { validator: this.validateName, trigger: 'blur' }
	          ]
	        }
	      };
	    },
	    methods: {
	        	validateName : function(rule, value, callback){
		        if (value === '') {
		          callback(new Error('请输入用户名！'));
		        } else if (!/^[a-zA-Z0-9_]{1,149}$/.test(value)) {
		          callback(new Error('请输入用大小写字母或者数字或者下划线组成且不超过150字节的用户名！'));
		        } else {
		          callback();
		        }
		      }
	    }
	  }
</script>

<style>
	#form2{
		padding:50px 100px 0 150px;
	}
</style>